<!DOCTYPE html>
<html>

<head>
    <title>理财</title>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1.0,maximum-scale=1,user-scalable=no">
    <meta content="yes" name="apple-mobile-web-app-capable">
    <meta content="telephone=no" name="format-detection">
    <link rel="stylesheet" type="text/css" href="/resource/web/css/reset.css">
    <link rel="stylesheet" type="text/css" href="/resource/web/css/flex.css">
    <link rel="stylesheet" type="text/css" href="/resource/web/css/swiper-3.4.1.min.css">
    <link rel="stylesheet" type="text/css" href="/resource/web/css/finacing-datil.css">
    <script type="text/javascript" src="/resource/web/js/flexible.js"></script>
    <script type="text/javascript" src="/resource/web/js/swiper-3.4.1.min.js"></script>
    <script type="text/javascript" src="/resource/web/js/jquery-1.11.1.min.js"></script>
</head>

<body>
    <div class="mod-tit">
        <div class="title">
            <p>{{$info->title}}</p>
            <a href="/Web/financing_list.html"><img class="back" src="/resource/web/img/newhead/path_7_copy.png"></a>
            <a href="#0"><img class="share fx" src="/resource/web/img/finacing/share.png"></a>
        </div>
    </div>
    <div class="fina-mod1">
        <div class="fdt-mod">
            <p class="fdt-mod-tit">预期年化收益</p>
            <p class="fdt-mod-num"><span>{{$info->rate_loaner}}</span>%</p>
            @if($info->type == "NEWBIE")
             <div class="nh-xiantou tcf-flex tcf-justify-justify">
                <p>新手专享</p>
                <p>限投5万</p>
            </div>
            @else
                @endif
            <ul class="fdt-ul tcf-flex tcf-justify-justify">
                <li>
                    <p>投资期限</p>
                    <p><span>{{$info->deadline}}</span>天</p>
                </li>
                <li>
                    <p>融资金额</p>
                    <p><span>{{$info->amount}}</span>万元</p>
                </li>
                <li>
                    <p>起投金额</p>
                    <p><span>{{$info->begin_amount}}</span>元</p>
                </li>
            </ul>
            <div class="fdt-bar">
                <div class="fdt-bar-inner"></div>
            </div>
            <div class="fdt-shengyu tcf-flex tcf-justify-justify">
                <p>剩余金额：<span>{{$info->balance_amount}}</span>元</p>
                <p class="fdt-nub">{{sprintf("%.2f",$info->jindu)}}%</p>
            </div>
        </div>
        <div class="line"></div>
        <div class="fin-wey">
            <ul class="fw-ul">
                <li>起息方式<span>{{$info->start_interest}}</span></li>
                <li>还款方式<span>{{$info->refund_type}}</span></li>
                <li>温馨提示<span>新手标用户仅有一次投资机会</span></li>
            </ul>
        </div>
        <div class="line"></div>
        <div class="fin-sm">
            <ul class="fs-ul tcf-flex tcf-justify-center">
                <li>
                    <img src="/resource/web/img/finacing/today.png">
                    <p class="fs-tit">今日投资</p>
                    <p class="fs-num">{{date("Y-m-d",time())}}</p>
                </li>
                <li>
                    <img src="/resource/web/img/finacing/time.png">
                    <p class="fs-tit">开始计息</p>
                    <p class="fs-num">{{date("Y-m-d",time())}}</p>
                </li>
                <li>
                    <img src="/resource/web/img/finacing/get.png">
                    <p class="fs-tit">回款到账</p>
                    <p class="fs-num">{{date("Y-m-d",$info->refund_time)}}</p>
                </li>
            </ul>
        </div>
        <div class="lookmore">
            <p class="lm-img"><img src="/resource/web/img/finacing/toup.png"></p>
            <p class="lmtit">向上滑动，查看更多详情</p>
        </div>
    </div>
    <div class="fin-mod2" id='fin-mod2' >
    	<ul class="fd2-ul tcf-flex tcf-justify-center">
    		<li class="fu-act" id="tab">项目简介</li>
            <li id="tab2">常见问题</li>
            <li id="tab3">投标记录</li>
    	</ul>
    	<div class="fd2-tab1 tab" style="">
	    	<div class="line"></div>
	    	<div class="xmjj">
	    		<p class="xm-tit">质押票据</p>
	    		<p class="xm-img"><img src="{{$sp->business_ticket_img}}"></p>
	    		<div class="iner-line"></div>
	    	</div>
	    	<div class="xmjj">
	    		<p class="xm-tit">信息审核</p>
	    		<p class="xm-img2"><img src="/resource/web/img/finacing/msg-show.png"></p>
	    		<div class="iner-line"></div>
	    	</div>
	    	<div class="xmjj" >
	    		<p class="xm-tit">证明材料</p>
	    		<div class="xm-lb swiper-container">
	    			<ul class="swiper-wrapper">
                        @if(!empty($file->prove_file))
                            <li class="swiper-slide"> <img src="{{$file->prove_file}}"/>
                            </li>
                        @else
                        @endif
                            @if(!empty($file->prove_file1))
                                <li class="swiper-slide"> <img src="{{$file->prove_file1}}"/>
                                </li>
                            @else
                            @endif
                            @if(!empty($file->prove_file2))
                                <li class="swiper-slide"> <img src="{{$file->prove_file2}}"/>
                                </li>
                            @else
                            @endif
                            @if(!empty($file->prove_file3))
                                <li class="swiper-slide"> <img src="{{$file->prove_file3}}"/>
                                </li>
                            @else
                            @endif
                            @if(!empty($file->prove_file4))
                                <li class="swiper-slide"> <img src="{{$file->prove_file4}}"/>
                                </li>
                            @else
                            @endif
                            @if(!empty($file->prove_file5))
                                <li class="swiper-slide"> <img src="{{$file->prove_file5}}"/>
                                </li>
                            @else
                            @endif
	    			</ul>
	    		</div>
	    	</div>
	    </div>
	    <div class="fd2-tab2 tab2" style="display: none;">
	    	<div class="line"></div>
	    	<ul class="fd2-qst">
	    		<li class="fd2-q"><p>问</p><p class="wen">什么是票据质押借款类产品？</p></li>
	    		<li class="fd2-a"><p>答</p><p class="wen">票据质押类产品是指借入人以其持有的真实、有效、足额的票据作为质押担保，向出借人（即投资人）直接融资的项目，借入人承诺在借款到期时一次性还本付息给投资人。</p></li>
	    	</ul>
	    	<ul class="fd2-qst">
	    		<li class="fd2-q"><p>问</p><p class="wen">钢票盈安全吗?</p></li>
	    		<li class="fd2-a"><p>答</p><p class="wen">钢票网对融资企业和担保企业均做了详细的尽调和审核流程，确保企业有足够的还款能力和意愿，出票企业一般为国企，央企，上市公司，或钢铁行业的大型企业，如企业未能足额还款，项目到期后由上述企业无条件兑付。</p></li>
	    	</ul>
	    	<ul class="fd2-qst">
	    		<li class="fd2-q"><p>问</p><p class="wen">票据产品收益如何计算?</p></li>
	    		<li class="fd2-a"><p>答</p><p class="wen">票据产品收益=购买金额*预期年化收益率*产品期限/365</p></li>
	    	</ul>
	    	<ul class="fd2-qst">
	    		<li class="fd2-q"><p>问</p><p class="wen">票据产品到期后何时归还本息?</p></li>
	    		<li class="fd2-a"><p>答</p><p class="wen">票据产品将在到期后三个工作日内归还本息（双休及法定节假日顺延）。</p></li>
	    	</ul>
	    	<ul class="fd2-qst">
	    		<li class="fd2-q"><p>问</p><p class="wen">票据产品到期后本息归还到哪里？</p></li>
	    		<li class="fd2-a"><p>答</p><p class="wen">票据产品到期本息将回到您的钢票网个人账户中。</p></li>
	    	</ul>
	    	<ul class="fd2-qst">
	    		<li class="fd2-q"><p>问</p><p class="wen">项目没有募集成功怎么办？</p></li>
	    		<li class="fd2-a"><p>答</p><p class="wen">由第三方支付将已募集的资金按原路径返还给出借人。</p></li>
	    	</ul>
	    	<ul class="fd2-qst">
	    		<li class="fd2-q"><p>问</p><p class="wen">票据产品是否支持提前赎回？</p></li>
	    		<li class="fd2-a"><p>答</p><p class="wen">票据产品属于固定期限理财，产品存续期暂不支持提前赎回。</p></li>
	    	</ul>
	    </div>
        <p class="line"></p>
	    <div class="fd2-tab3 tab3 content" style="display: none;">
            <p class="lines"></p>

	    </div>
    </div>
    <div class="mod-tabimg">
        <div class="tabimg swiper-container">
            <ul class="swiper-wrapper">
                @if(!empty($file->prove_file))
                    <li class="swiper-slide"><img src="{{$file->prove_file}}">
                    </li>
                @else
                @endif
                @if(!empty($file->prove_file1))
                    <li class="swiper-slide">
                        <p><img src="{{$file->prove_file1}}"></p>
                    </li>
                @else
                @endif
                @if(!empty($file->prove_file2))
                    <li class="swiper-slide"><img src="{{$file->prove_file2}}">
                    </li>
                @else
                @endif
                @if(!empty($file->prove_file3))
                    <li class="swiper-slide"><img src="{{$file->prove_file3}}">
                    </li>
                @else
                @endif
                @if(!empty($file->prove_file4))
                    <li class="swiper-slide"><img src="{{$file->prove_file4}}">
                    </li>
                @else
                @endif
                @if(!empty($file->prove_file5))
                    <li class="swiper-slide"><img src="{{$file->prove_file5}}">
                    </li>
                @else
                @endif
            </ul>
        </div>
    </div>
    <input id="auto_id" style="display: none;" value="{{$info->auto_id}}">

        @if($info->status == "RELEASE")
        <div class="fil-dta-btn fil-dta-ove">即将开始</div>
        @elseif($info->status == "COLLECTING")
            @if(!empty($user_id)))
        <div class="fil-dta-btn fil-dta-by" onClick="location.href='/Web/invest/{{$info->auto_id}}.html'">立即加入</div>
              @else
                {{
        $salt = $_SERVER['REQUEST_URI'];
               Session::put('weburl',$salt);
       }}
                <div class="fil-dta-btn fil-dta-by" onClick="location.href='/Web/weblogin.html'">立即加入</div>
                @endif
        @elseif($info->status == "FULLSCALE" || $info->status == "REPAYING")
        <div class="fil-dta-btn fil-dta-end">已抢光</div>
        @endif

           {{--@if($info->status == "RELEASE")--}}
        {{--<div class="fil-dta-btn fil-dta-ove" >即将开始</div>--}}
        {{--@elseif($info->status == "COLLECTING")--}}

        {{--@elseif($info->status == "FULLSCALE" || $info->status == "REPAYING")--}}
        {{--<div class="fil-dta-btn fil-dta-end">已抢光</div>--}}
        {{--@endif--}}
<script type="text/javascript">

	$(".fd2-ul>li").on("click",function(){
        $(this).addClass('fu-act').siblings().removeClass("fu-act");
	});

    /*$(".tabimg img").on("click", function(e) {
        e.preventDefault();
        $(".mod-tabimg").css("display","none");
    });
    $(".mod-tabimg").on("click", function(e) {
        e.preventDefault();
        $(this).css("display","none");
    });*/

    $(".lookmore").click(function(){
        $(".fina-mod1").css("display","none");
        $(".fin-mod2").css("display","block");
    });

    $("#tab").click(function(){
        $(".tab").css("display","block");
        $(".tab2").css("display","none");
        $(".tab3").css("display","none");
    });
    $("#tab2").click(function(){
        $(".tab").css("display","none");
        $(".tab2").css("display","block");
        $(".tab3").css("display","none");
    });
    $("#tab3").click(function(){
        $(".tab").css("display","none");
        $(".tab2").css("display","none");
        $(".tab3").css("display","block");
    });
    var ftb = $(".fdt-nub").html();
    $(".fdt-bar-inner").width(ftb);
//    $(function(){document.addEventListener("touchmove", _touch, false);}) function _touch(event){alert(1);}




    //shang拉
    $(".fina-mod1").on("touchstart", function(e) {
        //e.preventDefault();
        startX = e.originalEvent.changedTouches[0].pageX;
        startY = e.originalEvent.changedTouches[0].pageY;
    });
    $(".fina-mod1").on("touchmove", function(e) {
        //e.preventDefault();
        moveEndX = e.originalEvent.changedTouches[0].pageX;
        moveEndY = e.originalEvent.changedTouches[0].pageY;
        mvx = moveEndX - startX;
        mvy = moveEndY - startY;
        offtop = $(document).scrollTop();
        //console.log(offtop);
        console.log(mvy);
        if ( mvx < 5 && mvy < -50 ){
            console.log(mvy);
            offtop = 0;
            $(".fil-dta-btn").hide();
            $(".fin-mod2").slideDown(function(){
                    var mySwiper = new Swiper('.swiper-container',{
                        slidesPerView : 3,
                        spaceBetween : 20,
                        loop : true,
                    });
            });
            $(".fina-mod1").slideUp(300,function (){
                var tTop = $(window).scrollTop();
                var timer = setInterval(function (){
                    if(tTop<= 0){
                        clearInterval(timer);
                    }
                    $(window).scrollTop(tTop-=3);
                })
            });
        }
    });
    //xia拉
    var startX,startY,moveEndX,moveEndY,mvx,mvy,offtop;
    $(".fin-mod2").on("touchstart", function(e) {
        //e.preventDefault();
        startX = e.originalEvent.changedTouches[0].pageX;
        startY = e.originalEvent.changedTouches[0].pageY;
    });
    $(".fin-mod2").on('touchend', function (e){
        moveEndX = e.originalEvent.changedTouches[0].pageX;
        moveEndY = e.originalEvent.changedTouches[0].pageY;
        mvy = moveEndY - startY;
        if(mvy > 150){
            $(".fil-dta-btn").show();
            $(".fin-mod2").slideUp();
            $(".fina-mod1").slideDown();

        }
    })
    /*var mySwiper2 = new Swiper('.tabimg',{
        slidesPerView : 1,
        loop : true,
    });*/
    /*$(".swiper-wrapper li").on("touchend",function(){
        $(".mod-tabimg").css("display","block");
        var mySwiper2 = new Swiper('.tabimg',{
            slidesPerView : 1,
            slidesPerGroup : 1,
            loop : true,
        });
    })*/

</script>
<script src="/resource/web/js/dropload.min.js"></script>
<script>
    $(".acc-tab>div").on("touchend",function(){
        $(this).addClass('accred').siblings().removeClass("accred");
    });
    function getLocalTime(nS) {
        var dateStr=new Date(parseInt(nS) * 1000).toLocaleDateString();
        dateStr=dateStr.replace(/年|月/g, "/").replace(/日/g,"");
        var month = (new Date(dateStr)).getMonth() + 1;
        var year = (new Date(dateStr)).getFullYear();
        var date = (new Date(dateStr)).getDate();
        if (month < 10) {
            month = '0' + month;
        }
        if (date < 10) {
            date = '0' + date;
        }
        return year+"-"+month+"-"+date;
    }

    $(function(){
        // 页数
        var auto_ids = $("#auto_id").val();
        var page = 0;
        // 每页展示5个
        //var size = 10;
        // dropload
        $('.content').dropload({
            scrollArea : window,
            loadDownFn : function(me){
                page++;
                var result = '';
                $.ajax({
                    type: 'GET',
                    processData: false,//https://www.gangpiaowang.com
                    url: '/Web/financing_details_jct?auto_id='+auto_ids+'&type=3&page='+page,
                    dataType: 'json',
                    success: function(data){
                        var arrLen = data.data.length;
                        var arrlist = data.data;
                        //console.log(arrLen);
                        if(arrLen > 0){
                            for(var i=0; i<arrLen; i++){
                                //console.log( arrlist[i] );
                                result +=   '<div class="tb3-cont"><p class="tb3-l">'
                                        +'<span class="tb3-tell">'+arrlist[i].telephone+'</span><br />'
                                        +'<span class="tb3-time">'+getLocalTime(arrlist[i].add_time)+'</span></p>'
                                        +'<p class="tb3-noney">&yen'+arrlist[i].amount+'</p></div>'
                            }
                            // 如果没有数据
                        }else{
                            // 锁定
                            me.lock();
                            // 无数据
                            me.noData();
                        }
                        $('.tab3 .lines').append(result);
                        me.resetload();
                        // 为了测试，延迟1秒加载
                        /*setTimeout(function(){
                         // 插入数据到页面，放到最后面
                         $('.lists').append(result);
                         // 每次数据插入，必须重置
                         me.resetload();
                         },1000);*/
                    },
                    error: function(xhr, type){
                        console.log('Ajax error!');
                        // 即使加载出错，也得重置
                        me.resetload();
                    }
                });
            }
        });
    });
</script>
</body>

</html>
